﻿<!DOCTYPE html>
<html>
<head>
	  <meta charset="utf-8">
	  <title></title>
	  <meta name="renderer" content="webkit">
	  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	  <link rel="stylesheet" href="../layui/css/layui.css"  media="all">
</head>
<body>

	<div class="layui-fluid">
      <p>
        <div class="layui-inline">
          日期选择：
        </div>
        <div class="layui-inline"> <!-- 注意：这一层元素并不是必须的 -->
          <input type="text" class="layui-input" style="width:300px;" id="date1">
        </div>
      </p>
      <div class="layui-tab">
        <ul class="layui-tab-title">
          <li  class="layui-this">座席拨打数据概况</li>
          <li>数据概况</li>
        </ul>
        <div class="layui-tab-content">
          <div class="layui-tab-item layui-show">

              <div class="layui-block">
                <table id="demo" lay-filter="test"></table>
              </div>
          </div>
          <div class="layui-tab-item">
            <div class="layui-block">
              <table id="demo1" lay-filter="test1"></table>
            </div>
          </div>
          
        </div>
      </div>
	</div>      
</body>
<script src="../layui/layui.all.js"></script>
<script type="text/javascript" src="../../disanfanglogin/vendor/jquery/jquery-3.2.1.min.js"></script>
<script type="text/javascript" src="../js/linxi.js"></script>
<script type="text/javascript">
	$(document).ready(function(){

    
    linxi.loginYanZheng(function(userInfo){

      
      if(userInfo.data.user_root.Agent_data_report==0){
            var layer = layui.layer;
            layer.msg('非法闯入')
            return;
      }

      var element = layui.element;

      var  kefuFileds = [ //表头
             {field: 'staffName', title: '客服姓名',  sort: true, fixed: 'left'}
             ,{field: 'callCount', title: '拨打数量',  sort: true, fixed: 'left'}
             ,{field: 'pickUpCount', title: '接通数量',  sort: true, fixed: 'left'}
             ,{field: 'pickUpRate', title: '接通率',  sort: true, fixed: 'left',templet:function(d){return d.pickUpRate + '%'}}
             ,{field: 'callTotalTime', title: '总通话时长',  sort: true, fixed: 'left'}
             ,{field: 'effectiveCallTotalTimeAvg', title: '有效通话平均时长',  sort: true, fixed: 'left'}
             ,{field: '', title: '派客情况',  sort: true, fixed: 'left',templet:function(d){

                  var value = $('#date1').val()

                  var dateRange = value.split(' - ')

                  dateRange = dateRange[0].split(' ')[0]+"&endDate="+dateRange[1].split(' ')[0]

                  var par={}

                  $.ajax({

                    url:'../api/api.php?type=getKeFuFenPeiCount&followerName='+d.staffName+'&starDate='+dateRange,
                    async:false,
                    success: function(data){
                        data = JSON.parse(data).data[0]
                        par = data            
                    }
                  })
        
                  if(par!==undefined){

                    if(par.zhuandan>=6){

                      return "<div class=\"layui-badge paikedatil \" lay-event=\"pai\">派：" + par.COUNT + "</div> <div class=\"layui-badge\">转：" + par.zhuandan + "</div> <div class=\"layui-badge\">NO：" + par.pass + "</div>"

                    }else{

                      return "<div class=\"layui-badge layui-bg-cyan paikedatil\" lay-event=\"pai\">派：" + par.COUNT + "</div> <div class=\"layui-badge layui-bg-cyan\">转：" + par.zhuandan + "</div> <div class=\"layui-badge layui-bg-cyan\">NO：" + par.pass + "</div>"

                    }

                    
                  }else{
                    return ""
                  }

                  $(".paikedatil").click(function(e){
                    console.log(e)
                  })
              
             }}
      ]

      var kefuapiName = 'baobiao'

      var kefustarDate = new Date().Format('yyyy-MM-dd')

      var kefuendDate = new Date().Format('yyyy-MM-dd')

      kefuele = '#demo'

      var parmsObj = {type:kefuapiName,starDate:kefustarDate,endDate:kefuendDate}
      linxi.table.render({

               elem: kefuele
              ,url: '../api/api.php'+linxi.createUrlParse(parmsObj) //数据接口
              ,page: false //开启分页
              ,cols: [kefuFileds]
              ,toolbar:"#importExcelBtn"
              ,defaultToolbar:[]
      });


      var dateFileds = [
          {field: 'statisticsDate', title: '日期时间',  sort: true, fixed: 'left'}
         ,{field: 'callCount', title: '拨打数量',  sort: true, fixed: 'left'}
         ,{field: 'pickUpCount', title: '接通数量',  sort: true, fixed: 'left'}
         ,{field: 'pickUpRate', title: '接通率',  sort: true, fixed: 'left',templet:function(d){return d.pickUpRate + '%'}}
         ,{field: 'callTotalTime', title: '总通话时长',  sort: true, fixed: 'left'}
         ,{field: 'effectiveCallTotalTimeAvg', title: '有效通话平均时长',  sort: true, fixed: 'left'}
      ]

      var dateapiName = 'dateBiao'

      var datestarDate = new Date().Format('yyyy-MM-dd')

      var dateendDate = new Date().Format('yyyy-MM-dd')

      dateele = '#demo1'

      // createTable(dateapiName,datestarDate,dateendDate,dateele,dateFileds)

      linxi.createTable({type:dateapiName,starDate:kefustarDate,endDate:kefuendDate},dateele,dateFileds)


      linxi.laydate('#date1',function(value, date, endDate){

          var dateRange = value.split(' - ')

          dateRange = dateRange[0].split(' ')[0]+"&endDate="+dateRange[1].split(' ')[0]

          linxi.table.reload('demo', {
                url: '../api/api.php?type=baobiao&starDate='+dateRange
          });

          linxi.table.reload('demo1', {
                url: '../api/api.php?type=dateBiao&starDate='+dateRange
          });

      })


    })

    linxi.table.on('tool(test)',function(obj){
      
        var d = obj.data
        
        if(obj.event=='pai'){

          var value = $('#date1').val()

          var dateRange = value.split(' - ')

          var starDate = dateRange[0].split(' ')[0]

          var endDate = dateRange[1].split(' ')[0]

          var $html = `
          <table id="kefufenpaidatil" layui-filter="kefufenpaidatil"></table>
          `
          linxi.layer.open({
            type: 1,
            skin: 'layui-layer-rim', //加上边框
            area: ['100%', '100%'], //宽高
            content: $html,
            title:'沟通信息',
            shadeClose:true,
              success: function(layero, index){
                console.log(layero, index);

                var dateFileds=[
                    {field: 'updatetime', title: '日期'}
                   ,{field: 'customerId', title: 'ID'}
                   ,{field: 'name', title: '客资状态'}
                   ,{field: 'followUserName', title: '客服姓名'}
                   ,{field: 'mobile', title: '手机号码'}
                   ,{field: 'Reasons_for_disqualification', title: '备注'}

                  ]

                  linxi.createTable({type:"getKeFuFenPeiDatilTable",starDate:starDate,endDate:endDate,followerName:d.staffName},'#kefufenpaidatil',dateFileds)

              }
          })
       }

    })

    linxi.table.on('toolbar(test)',function(obj){

      var value = $('#date1').val()

      var dateRange = value.split(' - ')

      dateRange = dateRange[0].split(' ')[0]+"&endDate="+dateRange[1].split(' ')[0]

      var index = linxi.layer.load(0, {shade: false})

      if(obj.event == 'importExcel'){
        
        var res={}
   

        $.ajax({

          url:'../api/api.php?type=getKeFuFenPeiDatilTable&followerName=all&starDate='+dateRange,
          async:true,
          success: function(data){

              data = JSON.parse(data).data
              console.log(data) 
              res['data'] = JSON.stringify(data)
              res['type']='importExcel'
              res['tableName']='林西客资派单明细'
              res['fields'] = [{field:'updatedAt',title:'日期'},{field:'followUserName',title:'客服'},{field:'name',title:'客资状态'},{field:'Reasons_for_disqualification',title:'备注'},{field:'customerId',title:'ID'},{field:'mobile',title:'手机号码'}]
              
              $.post('../api/api.php',res,function(data){
                  
                  linxi.download_file(data)

                  linxi.layer.close(index)
              })          
          }

        })

      }else if(obj.event=='importExcelCount'){


        $.get('../api/api.php?type=baobiao&starDate='+dateRange,function(data){
          
          dataq = JSON.parse(data)['data']

          for(var i = 0 ; i < dataq.length ; i ++){
                var d = dataq[i]
                $.ajax({

                    url:'../api/api.php?type=getKeFuFenPeiCount&followerName='+d.staffName+'&starDate='+dateRange,
                    async:false,
                    success: function(data){
                        datakefu = JSON.parse(data).data[0]
                        if(datakefu!==undefined){
                          dataq[i]['COUNT'] =   datakefu['COUNT']  
                          dataq[i]['zhuandan'] =   datakefu['zhuandan']  
                          dataq[i]['pass'] =   datakefu['pass']  
                        }else{
                          dataq[i]['COUNT'] = 0  
                          dataq[i]['zhuandan'] = 0
                          dataq[i]['pass'] = 0
                        }
                    }

                  })
          }


          res={}
          
          res['data'] = JSON.stringify(dataq)
          res['type']='importExcel'
          res['tableName']='坐席数据报表'
          res['fields'] = [{field:'staffName',title:'客服'},{field:'callCount',title:'拨打数量'},{field:'pickUpCount',title:'接通数量'},{field:'pickUpRate',title:'接通率（%）'},{field:'effectiveCallTotalTime',title:'总通话时长'},{field:'effectiveCallTotalTimeAvg',title:'有效通话平均时长'},{field:'COUNT',title:'派单数'},{field:'zhuandan',title:'转单数'},{field:'pass',title:'不合格数'}]
          
          $.post('../api/api.php',res,function(data){
              
              linxi.download_file(data)

              linxi.layer.close(index)


          }) 


        })
      }
    })

	})
</script>
</html>

<script type="text/html" id="importExcelBtn">
  <button class='layui-btn layui-btn-primary' lay-event='importExcel'>导出派单明细</button>
  <button class='layui-btn layui-btn-primary' lay-event='importExcelCount'>导出坐席数据表</button>

</script>